<template>
    <div>
        <Topbar>我的看房团</Topbar>
        <div class="main">
            <div v-for="v in list" class="main-inner">
                <div class="inner1">{{v.title}}</div>
                <div>
                    <span class="txt1">发车时间：</span>
                    <span class="txt2">{{v.time}}</span>
                </div>
                <div>
                    <span class="txt1">发车地点：</span>
                    <span class="txt2">{{v.form}}</span>
                </div>
                <div class="inner2">
                    <span>{{v.dizhi}}</span>
                    <span>{{v.price}}</span>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import Topbar from '../components/Topbar.vue'
import axios from 'axios'
    export default{
        data:function(){
            return {
                list:[]
            }
        },
        components:{
            Topbar
        },
        mounted:function(){
            this.http.post("/user/islogin")
            .then(res=>{
                console.dir(res);
                this.list=res.data.userInfo.myvisitive;
            })
        }
    }
</script>

<style scoped>
.main-inner{
    background-color: #F4F4F4;
    border-radius: 8px;
    padding: 10px;
    margin: 10px 20px;
}
.main{
    height: 100vh;
    overflow-y: scroll;
    margin-top: 20px;
}
.main-inner div{
    margin: 8px;
}
.inner1{
    text-align: center;
    font-size: 14px;
}
.inner2{
    display: flex;
    justify-content: space-between;
}
.inner2 span:nth-of-type(1){
    font-size: 12px;
}
.inner2 span:nth-of-type(2){
    font-size: 12px;
    color: #FF7500;
}
.txt1{
    font-size: 14px;
    font-weight: 700;
}
.txt2{
    font-size: 12px;
    color: #666666;
}
</style>